﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

    <title> 测试 Session 的 Ajax 例子 </title>
    <script src="../Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>

    <script type="text/javascript">


        $(document).ready(function () {


            //  登录的 点击处理事件.
            $("#btnLogin").click(function () {

                // 调用 ajax 
                $.ajax({
                    url: "/TestJsonWebService.asmx/TestLogin",
                    type: "post",
                    contentType: "application/json;utf-8",
                    dataType: 'json',
                    data: '{"userName":"' + $("#txtUserName").val() + '","password":"' + $("#txtPassword").val() + '"}',
                    success: function (data) {
                        ShowAjaxResult(data.d);
                    },

                    error: function (msg) {
                        alert(msg.responseText);
                    }
                })
            });



            //  执行某需要登录后才能处理的操作 点击处理事件.
            $("#btnSomeThingNeedLogin").click(function () {

                // 调用 ajax 
                $.ajax({
                    url: "/TestJsonWebService.asmx/TestDoSomethingNeedLogin",
                    type: "post",
                    contentType: "application/json;utf-8",
                    dataType: 'json',
                    data: "{}",
                    success: function (data) {
                        ShowAjaxResult(data.d);
                    },

                    error: function (msg) {
                        alert(msg.responseText);
                    }
                })
            });



        })



        // 显示  执行结果.
        function ShowAjaxResult(pResult) {

            // alert(pResult);

            $("#lblCallAjaxResult").html(pResult);
        }

    </script>


</head>


<body>


<table>

  <tr>
    <td>
      用户名
    </td>
    <td>
        <input id="txtUserName" type="text" value="admin"/>
    </td>
  </tr>


  <tr>
    <td>
      密码
    </td>
    <td>
        <input id="txtPassword" type="password" value="123456"/>
    </td>
  </tr>


  <tr>
    <td colspan="2">
        <input id="btnLogin" type="button" value="登录" />
    </td>
  </tr>



  <tr>
    <td colspan="2">
        <input id="btnSomeThingNeedLogin" type="button" value="执行某需要登录后才能处理的操作" />
    </td>
  </tr>

</table>


<hr />

执行结果：
<label id="lblCallAjaxResult"></label>


</body>
</html>
